<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="ISO-8859-1">
<title>Chapter 4: Everything's An Illusion</title>

<link rel="shortcut icon" href="images/2reading.gif">
<link href="foti.css" rel="stylesheet" type="text/css">

<style type="text/css">


#canvas {
	margin: 10px auto 0 auto;
	border: 5px double #aa9e8c;
}


#bg, #char {display:none;}

</style>

<script type="text/javascript">
var vc, vctx, vi1, bgr;
	function init(){
		vc = document.getElementById("canvas");
		vctx = vc.getContext("2d");
		bgr = document.getElementById("bg");
		vctx.drawImage(bgr,0,0,800,600);
		vi1 = document.getElementById("char");
		setInterval("animation()",1100);		
	}
	
	var dax=0; counter=0;
	function animation(){
		if(counter >= 2) counter = 0; else counter++;
		vctx.drawImage(bgr,0,0,800,600);
		vctx.drawImage(vi1,dax,0,800,600,0,0,800,600);
		dax=800*counter;

	}
</script>

</head>

<body onload="init()">

	<h1>Figment of the Imagination</h1>
	<h2>Chapter 2: Everything's An Illusion</h2>
	<h2>Scene 3: I Don't Wanna Talk To You</h2>

<center><img src="images/line divider.png" width=800 style="opacity: .7;"></center>

<div id="content">

<center><canvas id="canvas" width=800 height=600></canvas></center>
<img id="bg" src="images/ch4/BGlocker.png" width=800 height=600>
<img id="char" src="images/ch4/run.png">


<center><img src="images/photo.png" width=800 style="margin:-4px 0 0 0;"></center>

<div id="scenetext">
<p>
	Ada was not ready to face John, not after dreaming about him, and with the pain she's dealing with now. 
	Quickly packing her things and grabbing the Tylenol, Ada left just as John was about to talk to her.
</p>

<center><img src="images/line divider.png" width=800 style="opacity: .7;"></center>
	
</div>

<div align="center" style="padding-bottom: 30px;">
<a href="Chapter4Scene2.jsp" title="Locker Rage"><button id="button">BACK</button></a>
<a href="tableofcontent.jsp" title="Back to Table of Contents"><button id="button2">TABLE OF CONTENTS</button></a>
<a href="Chapter4Scene4.jsp" title="Reality or Vagary?"><button id="button">NEXT</button></a>
</div>

</div>


</body>
</html>

